<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script><!--引入jQuery-->
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">

    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd" crossorigin="anonymous"></script> <meta charset="UTF-8">
    <title>扫码充电模拟</title>
</head>
<script type="text/javascript">
    //页面加载初始化赋值
    $(function () {
        $("#serverip").val("10.100.10.176")
        $("#serverPort").val("30100")
    })
    //连接服务器
    function serverConnection(){
        var serverip = $("#serverip").val();
        var serverPort = $("#serverPort").val();
        var deviceNo = $("#deviceNo").val();
        var version = $("#version option:selected").val();
        var deviceGunNum = $("#deviceGunNum").val();
        // var deviceGunNum = $("deviceGunNum").val();
        alert(serverip+" "+serverPort+""+deviceNo+""+version+""+deviceGunNum);
        $.ajax({
            type:"post",
            url:"client/startNettyClient",
            data:{"serverip":serverip,
                    "serverPort":serverPort,
                    "deviceNo":deviceNo,
                    "version":version,
                    "deviceGunNum":deviceGunNum},
            success(data){
                // alert(data.code);
                if(data.code==200){
                    alert("连接成功")
                }else{
                    alert("连接失败")
                }
            }
        })

    }

    //签到并开始心跳连接
    function signHeartbeat(){

    }

    //断开服务器连接
    function serverDisconnect(){
        $.ajax({
            type:"post",
            url:"client/stopNettyClient",
            // data:{"serverip":serverip,
            //     "serverPort":serverPort,
            //     "deviceNo":deviceNo,
            //     "version":version,
            //     "deviceGunNum":deviceGunNum},
            success(data){
                if(data.code==200){
                    alert("服务器连接已断开")
                }else{
                    alert("服务器断开连接失败")
                }
            }
        })

    }

    //开启充电
    function startCharging(){
        var deviceNo = $("#deviceNo").val();
        var userName = $("#userName").val();
        var vin = $("#vin").val();
        var carNo = $("#carNo").val();
        var gunNum = $('input[name="gunNum"]:checked').val();
        alert(deviceNo+"--"+gunNum);
        $.ajax({
            type:"post",
            dataType:"json",
            contentType:"application/json",
            url:"http://10.100.11.36:31509/scancode/charging/start",
            data:JSON.stringify({
                "userName": userName,
                "userType": "0",
                "carNo": carNo,
                "vin": vin,
                "deviceNo":deviceNo,
                "gunNum":gunNum}),
            success(data){
                if(data.code==200){
                    alert("已开启动充电")
                }else{
                    alert("启动充电失败,"+data.message)
                }
            }
        })
    }

    //结束充电
    function endCharging(){
        var deviceNo = $("#deviceNo").val();
        var gunNum = $('input[name="gunNum"]:checked').val();
        $.ajax({
            type:"post",
            dataType:"json",
            contentType:"application/json",
            url:"http://10.100.11.36:31509/scancode/charging/stop",
            data:JSON.stringify({
                "deviceNo":deviceNo,
                "gunNum":gunNum}),
            success(data){
                if(data.code==200){
                    alert("结束充电成功")
                }else{
                    alert("结束充电失败,"+data.message)
                }
            }
        })

    }

</script>
<body>
<div class="container">
    <div class="row">
        <div class="col-md-12">
            <h4><p class="text-muted">充电桩链接服务器</p></h4>
        </div>
    </div>
    <div class="row">
        <div class="col-md-3">
                <div class="form-inline">
                    <label for="serverip">服务器IP</label>
                    <input type="text" class="form-control" id="serverip" placeholder="服务器IP">
                </div>
        </div>
        <div class="col-md-3">
            <div class="form-inline row">
                <label for="serverPort">服务器端口</label>
                <input type="text" class="form-control" id="serverPort" placeholder="服务器端口">
            </div>
        </div>
        <div class="col-md-3">
            <div class="form-inline row">
                <label for="deviceNo">充电桩编号</label>
                <input type="text" class="form-control" id="deviceNo" placeholder="充电桩编号">
            </div>
        </div>
        <div class="col-md-3">
            <div class="form-inline">
                <label for="version">充电桩协议：</label>
                <select id="version" name="version" class="form-control">
                    <option value="3.4" selected>3.4</option>
                    <option value="3.4a">3.4a</option>
                    <option value="3.4a1">3.4a1</option>
                </select>
            </div>
        </div>
    </div>

    <div class="row">
<!--        <div class="col-md-3">-->
<!--            <div class="form-inline row">-->
<!--                <label for="deviceGunNum">充电枪数量</label>-->
<!--                <input type="number" class="form-control" id="deviceGunNum"  min="1"  placeholder="充电枪数量">-->
<!--            </div>-->
<!--        </div>-->
        <div class="col-md-3">
            <div class="form-inline row">
                <button type="button" class="btn btn-success" onclick="serverConnection()">链接服务器</button>
            </div>
        </div>
<!--        <div class="col-md-2">-->
<!--            <div class="form-inline row">-->
<!--                <button type="button" class="btn btn-info" onclick="signHeartbeat()">签到并发送心跳</button>-->
<!--            </div>-->
<!--        </div>-->
<!--        <div class="col-md-3">-->
<!--            <div class="form-inline row">-->
<!--                <button type="button" class="btn btn-warning" onclick="serverDisconnect()">断开服务器链接</button>-->
<!--            </div>-->
<!--        </div>-->
    </div>
<!--    <div class="row">-->
<!--        <div class="col-md-12">-->
<!--            <hr style="border-top:1px dashed #987cb9;" width="100%" color="#987cb9" size="1"/>-->
<!--        </div>-->
<!--    </div>-->
<!--    <div class="row">-->
<!--        <div class="col-md-12">-->
<!--            <h4><p class="text-muted">充电桩充电模拟</p></h4>-->
<!--        </div>-->
<!--    </div>-->
<!--    <div class="row">-->
<!--        <div class="col-md-3">-->
<!--            <div class="form-inline row">-->
<!--                <label for="userName">用户名</label>-->
<!--                <input type="text" class="form-control" id="userName" placeholder="用户名">-->
<!--            </div>-->
<!--        </div>-->
<!--        <div class="col-md-3">-->
<!--            <div class="form-inline row">-->
<!--                <label for="serverPort">车牌号</label>-->
<!--                <input type="text" class="form-control" id="carNo" placeholder="车牌号">-->
<!--            </div>-->
<!--        </div>-->
<!--        <div class="col-md-3">-->
<!--            <div class="form-inline row">-->
<!--                <label for="deviceNo">VIN码</label>-->
<!--                <input type="text" class="form-control" id="vin" placeholder="VIN码">-->
<!--            </div>-->
<!--        </div>-->

<!--    </div>-->

<!--    <div class="row">-->
<!--        <div class="col-md-6">-->
<!--            <div class="row">-->
<!--                <label for="deviceGunNum">枪号：</label>-->
<!--                <label class="checkbox-inline">-->
<!--                    <input type="radio" id="gunNum01" name="gunNum" value="01" checked> 01-->
<!--                </label>-->
<!--                <label class="checkbox-inline">-->
<!--                    <input type="radio" id="gunNum02" name="gunNum" value="02"> 02-->
<!--                </label>-->
<!--            </div>-->
<!--        </div>-->

<!--    </div>-->
<!--    <div class="row">-->
<!--        <div class="col-md-3">-->
<!--            <div class="form-inline row">-->
<!--                <button type="button" class="btn btn-success" onclick="startCharging()">启动充电</button>-->
<!--            </div>-->
<!--        </div>-->
<!--        <div class="col-md-3">-->
<!--            <div class="form-inline row">-->
<!--                <button type="button" class="btn btn-warning" onclick="endCharging()">结束充电</button>-->
<!--            </div>-->
<!--        </div>-->
<!--    </div>-->

</div>
</body>
</html>